<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>挂号</title>
    <link rel="stylesheet" type="text/css" href="../../css/common/base.css">
    <link rel="stylesheet" type="text/css" href="../../css/medicalAd/medicalAd.css">
    <link rel="stylesheet" type="text/css" href="../../plugin/select/css/nice-select.css">
    <link rel="stylesheet" type="text/css" href="../../plugin/switchTab/css/responsive.tabs.css">
    <link rel="stylesheet" type="text/css" href="../../plugin/datepockerRange/css/datepicker.css">
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<style>

</style>

<body>
    <div id="medicalAd" class="lz-main">
        <div class="medicalAd-content">
            <div class="user-mess">
                <div>
                    <div class="medicalAd-head">
                        <h2>新增挂号</h2>
                    </div>
                    <form id="base-mess" class="lz-form">
                        <div>
                            <div class="lz-form-head">
                                基本信息
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">姓名:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">年龄:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item" style="float: right;">
                                <label class="lz-form-item-label">出生日期:</label>
                                <div class="c-datepicker-date-editor c-datepicker-single-editor J-datepicker-day mt10">
                                    <i class="c-datepicker-range__icon kxiconfont icon-clock"></i>
                                    <input type="text" autocomplete="off" name="" placeholder="选择日期" class=" c-datepicker-data-input only-date" value="">
                                </div>
                            </div>
                            <div class="lz-col-1 lz-form-item" style="float: left;">
                                <label class="lz-form-item-label">性别:</label>
                                <!-- <input class="lz-form-item-input" type="text" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项"> -->
                                <select class="me-select">
                                    <option value="0">请选择</option>
                                    <option value="1">男</option>
                                    <option value="2">女</option>
                                </select>
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">卡号:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">手机号:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                        <div class=" lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">病人性质:</label>
                                <select class="me-select">
                                    <option value="0">请选择</option>
                                    <option value="1">自费</option>
                                    <option value="2">医保</option>
                                    <option value="3">民政</option>
                                    <option value="4">农保</option>
                                </select>
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">身份证:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">地址:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">备注:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off" data-bv="true" data-bv-require="true" data-bv-require-error="*必填项">
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                    </form>
                    <form class="lz-form">
                        <div>
                            <div class="lz-form-head">
                                科室信息
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">医生:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">科室:</label>
                                <select class="me-select">
                                    <option value="0">请选择</option>
                                    <option value="1">全部</option>
                                    <option value="2">挂号室</option>
                                </select>
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                    </form>
                    <form class="lz-form">
                        <div>
                            <div class="lz-form-head">
                                收费信息
                            </div>
                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">挂号费:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">诊金:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off">
                                <span class="lz-form-item-help"></span>
                            </div>
                        </div>
                        <div class="total">
                            <label>合计:</label>
                            <span>1233元</span>
                            <button class="lz-btn lz-btn-primary">附加费</button>
                        </div>
                        <div class="confirm">
                            <button type="button" class="lz-btn lz-btn-primary">确定收费</button>
                        </div>
                    </form>
                </div>
            </div>
            <div class="medicalAd-history">
                <div class="medicalAd-head-right">
                    <div class="mh-title">
                        <h2>挂号列表</h2>
                    </div>
                    <form class="lz-form me-head-form">
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item" style="flex: 1.5;">
                                <label class="lz-form-item-label">挂号时间:</label>
                                <div class="c-datepicker-date-editor  J-datepicker-range-day mt10">
                                    <i class="c-datepicker-range__icon kxiconfont icon-clock"></i>
                                    <input placeholder="开始日期" name="" class="c-datepicker-data-input two-date" value="">
                                    <span class="c-datepicker-range-separator">-</span>
                                    <input placeholder="结束日期" name="" class="c-datepicker-data-input two-date" value="">
                                </div>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">姓名:</label>
                                <input class="lz-form-item-input" type="text" autocomplete="off">
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">科室:</label>
                                <select class="me-select">
                                    <option value="0">请选择</option>
                                    <option value="1">全部</option>
                                    <option value="2">挂号室</option>
                                </select>
                                <span class="lz-form-item-help"></span>
                                <span class="lz-form-item-help"></span>
                            </div>

                        </div>
                        <div class="lz-form-row">
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">医生:</label>
                                <select class="me-select">
                                            <option value="0">请选择</option>
                                            <option value="1">梁医生</option>
                                        </select>
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item">
                                <label class="lz-form-item-label">来源:</label>
                                <select class="me-select">
                                        <option value="0">请选择</option>
                                        <option value="1">自费</option>
                                    </select>
                                <span class="lz-form-item-help"></span>
                            </div>
                            <div class="lz-col-1 lz-form-item me-head-search">
                                <button type="button" class="lz-btn lz-btn-primary">搜索</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="me-tab">
                    <ul class="tabs-list ts-list">
                        <li class="active"><a href="javascript:;">全部</a></li>
                        <li><a>挂号<span class="tabs-list-text">1</span>人</a></li>
                        <li><a>已诊<span class="tabs-list-text">2</span>人</a></li>
                        <li><a>退号<span class="tabs-list-text">3</span>人</a></li>
                    </ul>
                    <div class="ts-container">
                        <div class="ts-content tab-content" style="display:block;">
                            <div class="me-pers-content">
                                <!-- 病人信息卡 -->
                                <div class="per-cord">
                                    <div class="per-cord-up">
                                        <div class="per-up-left">
                                            <div class="per-img"><i class="fa fa-user-circle-o"></i></div>
                                            <div class="per-name">lzlzl</div>
                                            <div class="per-type">自费</div>
                                        </div>
                                        <div class="per-up-right">
                                            <div class="cord-type">挂号/挂号</div>
                                            <div class="cord-mess">男/lz/123231434</div>
                                            <div class="cord-doc">挂号室/梁医生</div>
                                            <div class="cord-date">2019-08-30 13:00</div>
                                        </div>
                                    </div>
                                    <div class="per-cord-down">
                                        <div class="per-down-item"><i class="fa fa-edit"></i></div>
                                        <div class="per-down-item"><i class="fa fa-user-circle-o"></i></div>
                                        <div class="per-down-item"><i class="fa fa-mail-reply "></i></div>
                                        <div class="per-down-item"><i class="fa fa-sticky-note-o"></i></div>
                                    </div>
                                </div>
                                <!-- 病人信息卡 -->
                                <div class="per-cord">
                                    <div class="per-cord-up">
                                        <div class="per-up-left">
                                            <div class="per-img"><i class="fa fa-user-circle-o"></i></div>
                                            <div class="per-name">lzlzl</div>
                                            <div class="per-type">自费</div>
                                        </div>
                                        <div class="per-up-right">
                                            <div class="cord-type">挂号/挂号</div>
                                            <div class="cord-mess">男/lz/123231434</div>
                                            <div class="cord-doc">挂号室/梁医生</div>
                                            <div class="cord-date">2019-08-30 13:00</div>
                                        </div>
                                    </div>
                                    <div class="per-cord-down">
                                        <div class="per-down-item"><i class="fa fa-edit"></i></div>
                                        <div class="per-down-item"><i class="fa fa-user-circle-o"></i></div>
                                        <div class="per-down-item"><i class="fa fa-mail-reply "></i></div>
                                        <div class="per-down-item"><i class="fa fa-sticky-note-o"></i></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="ts-content tab-content" style="display:none;">
                            <h1>2</h1>
                        </div>
                        <div class="ts-content tab-content" style="display:none;">
                            <h1>3</h1>
                        </div>
                        <div class="ts-content tab-content" style="display:none;">
                            <h1>4</h1>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../js/common/jquery/jquery-2.2.4.js"></script>
    <script src="../../plugin/datepockerRange/js/moment.min.js"></script>
    <script src="../../plugin/datepockerRange/js/datepicker.all.js"></script>
    <script src="../../plugin/select/js/jquery.nice-select.min.js"></script>
    <script src="../../plugin/switchTab/js/re-tabs-simplify.js"></script>
    <script>
        $(function() {
            $('.me-select').niceSelect();
            $('.me-tab').resTabsSimp();
            $('.J-datepicker-range-day').datePicker({
                hasShortcut: true,
                format: 'YYYY-MM-DD',
                isRange: true,
                shortcutOptions: [{
                    name: '最近一周',
                    day: '-7,0'
                }, {
                    name: '最近一个月',
                    day: '-30,0'
                }, {
                    name: '最近三个月',
                    day: '-90, 0'
                }]
            });
            $('.J-datepicker-day').datePicker({
                hasShortcut: true,
                format: 'YYYY-MM-DD',
                shortcutOptions: [{
                    name: '今天',
                    day: '0'
                }, {
                    name: '昨天',
                    day: '-1'
                }, {
                    name: '一周前',
                    day: '-7'
                }]
            });
        });
    </script>
</body>

</html>